﻿
@charset "utf-8";
/*******************************
 * Copyright:智讯互动(www.zhixunhudong.com)
 * Author:Mr.Think
 * Description:移动端通用基础CSS
 *******************************/
*{margin:0;padding:0}
body{font-size:13px;font-family:arial;-webkit-text-size-adjust:none;line-height:1.62;background-color: #000}
body,html{overflow:hidden;overflow-y:auto;}
table{border-collapse:collapse;border-spacing:0}
h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal}
ul,ol,li{list-style:none;}
em{font-style:normal}
img{border:none;}
input,img{vertical-align:middle;}
input,select{outline:0;border-radius:0;-webkit-appearance:none}
q:before, q:after { content:'' }
.fn-clear:after {visibility: hidden;display: block;font-size: 0;content: " ";clear: both;height: 0;}
.fn-clear{*zoom:1}
a{color:#666;text-decoration:none;-webkit-tap-highlight-color:rgba(0,0,0,0);}
a:active{color:#333;-webkit-tap-highlight-color:rgba(0,0,0,0);}
section,aside,header,footer,hgroup,article{display:block}

.foot{width:100%;min-width:320px;margin-top:10px;padding:10px 0;color:#222;text-align:center;}
.foot a{color:#222;margin:0 3px;}

.share-tips{position: fixed;left:50%;top:10px;margin-left:-125px;width:250px;height:222px;z-index:1000;background:url(http://a.zhixun.in/plug/img/share-tips.png) center center no-repeat;background-size: 250px auto}
/*网页样式重置reset*/
html { font-size:1em;-webkit-tap-highlight-color:rgba(0,0,0,0); -webkit-tap-highlight:rgba(0,0,0,0);-webkit-text-size-adjust:none;}
body { font-size:0.75em}
label { cursor:pointer}
a:link, a:visited { text-decoration:none}
input,button,select,textarea{outline:none} textarea{resize:none;}
a, abbr, acronym, address, applet, article, aside, audio, b, blockquote, big, body, center, canvas, caption, cite, code, command, datalist, dd, del, details, dfn, dl, div, dt, em, embed, fieldset, figcaption, figure, font, footer, form, h1, h2, h3, h4, h5, h6, header, hgroup, html, i, iframe, img, ins, kbd, keygen, label, legend, li, meter, nav, menu, object, ol, output, p, pre, progress, q, s, samp, section, small, span, source, strike, strong, sub, sup, table, tbody, tfoot, thead, th, tr, tdvideo, tt,
u, ul, var { margin:0; padding:0}
article, aside, footer, header, hgroup, nav, section, figure, figcaption { display: block} /*html5设置*/
h1, h2, h3, h4, h5, h6, th, td, table, input, button, select, textarea, sub{ font-size:1em}
em, cite, address, optgroup { font-style:normal}
kbd, samp, code { font-family:monospace}
img, input, button, select, textarea { vertical-align:middle}
ul, ol { list-style:none}
img, fieldset { border:0}
abbr, acronym { cursor:help; border-bottom:1px dotted black}
table {	width:100%; border-spacing:0; border:0}
table th, table td { border:0}
legend, hr { overflow:hidden; position:absolute; top:0; left:0}
legend, hr, caption { visibility:hidden; font-size:0; width:0; height:0; line-height:0}
/*------------------------------------------------------------------------------------------------------------------------------*/
/*统一样式*/
html,body{width:100%;height:100%;overflow:hidden}
/*index*/
.p-index{height:100%;width:100%;overflow:hidden;display:none}
/*模块 m-*/
.m-page {position:absolute;left:0;top:0;height:100%;width:100%}
.m-page.show {z-index:10;display:block}
.m-page.hide {z-index:5;display:none}
.m-page.active {z-index:15;display:block}
.m-img {width:100%;height:100%}
.loading {
    position: fixed;
    top: 30%;
    left: 50%;
    margin: -14px 0 0 -42px;
    padding: 10px;
}
.loading-dot {
    float: left;
    width: 8px;
    height: 8px;
    margin: 0 4px;
    background: #fff;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    opacity: 0;
    -webkit-box-shadow: 0 0 2px black;
    -moz-box-shadow: 0 0 2px black;
    -ms-box-shadow: 0 0 2px black;
    -o-box-shadow: 0 0 2px black;
    box-shadow: 0 0 2px black;
    -webkit-animation: loadingFade 1s infinite;
    -moz-animation: loadingFade 1s infinite;
    animation: loadingFade 1s infinite;
}
.loading-dot:nth-child(1) {
    -webkit-animation-delay: 0s;
    -moz-animation-delay: 0s;
    animation-delay: 0s;
}
.loading-dot:nth-child(2) {
    -webkit-animation-delay: 0.1s;
    -moz-animation-delay: 0.1s;
    animation-delay: 0.1s;
}
.loading-dot:nth-child(3) {
    -webkit-animation-delay: 0.2s;
    -moz-animation-delay: 0.2s;
    animation-delay: 0.2s;
}
.loading-dot:nth-child(4) {
    -webkit-animation-delay: 0.3s;
    -moz-animation-delay: 0.3s;
    animation-delay: 0.3s;
}
@-webkit-keyframes loadingFade {
    0% { opacity: 0; }
    50% { opacity: 0.8; }
    100% { opacity: 0; }
}
@-moz-keyframes loadingFade {
    0% { opacity: 0; }
    50% { opacity: 0.8; }
    100% { opacity: 0; }
}
@keyframes loadingFade {
    0% { opacity: 0; }
    50% { opacity: 0.8; }
    100% { opacity: 0; }
}
/* ---------------------------华而不实的分割线---------------------------*/
.m-img img{position:absolute}
.bg-form{width:320px;-webkit-animation:bgForm 6s infinite linear}
.bg-top{position:absolute;top:0;left:0;width:100%;height:54px}
.bg-top img{top:0;/*left:0;width:100%;height:54px;*/left:50%;margin-left:-160px;width:320px}
.bg-pic{top:54px;left:0;width:100%;height:176px}
.bg-title{top:78px;left:50%;margin-left:-145px}
.bg-txt1{top:254px;left:50%;margin-left:-160px;width:320px}
.bg-txt2{top:121px;left:50%;margin-left:-160px;width:320px}
.bg-touch{bottom:10px;left:50%;margin-left:-145px;width:290px}
@-webkit-keyframes bgForm{
	0%{
		-webkit-transform:translate(0,0) scale(1,1);
	}
	25%{
		-webkit-transform:translate(-6px,-6px) scale(1.2,1.2);
	}
	50%{
		-webkit-transform:translate(-3px,6px) scale(1.4,1.4);
	}
	75%{
		-webkit-transform:translate(10px,10px) scale(1.2,1.2);
	}
	100%{
		-webkit-transform:translate(0,0) scale(1,1);
	}
}
.slide-right{opacity:0;-webkit-animation:slideRight .9s ease-out forwards}
@-webkit-keyframes slideRight{
	0%{
		opacity:0;
		-webkit-transform:translate(-20px,0);
	}
	100%{
		opacity:1;
		-webkit-transform:translate(0,0);
	}
}
.slide-left{opacity:0;-webkit-animation:slideLeft .9s ease-out forwards}
@-webkit-keyframes slideLeft{
	0%{
		opacity:0;
		-webkit-transform:translate(20px,0);
	}
	100%{
		opacity:1;
		-webkit-transform:translate(0,0);
	}
}
.slide-up{opacity:0;-webkit-animation:slideUp .9s ease-out forwards}
@-webkit-keyframes slideUp{
	0%{
		opacity:0;
		-webkit-transform:translate(0,20px);
	}
	100%{
		opacity:1;
		-webkit-transform:translate(0,0);
	}
}
.slide-down{opacity:0;-webkit-animation:slideDown .9s ease-out forwards}
@-webkit-keyframes slideDown{
	0%{
		opacity:0;
		-webkit-transform:translate(0,-20px);
	}
	100%{
		opacity:1;
		-webkit-transform:translate(0,0);
	}
}
.biger{-webkit-transform:scale(1,1);-webkit-animation:biger .7s linear alternate infinite;-webkit-animation-delay:.9s}
@-webkit-keyframes biger{
	0%{
		-webkit-transform:scale(1,1);
	}
	100%{
		-webkit-transform:scale(1.3,1.3);
	}
}
.bg-show{opacity:0;-webkit-animation:bgShow .6s linear forwards}
@-webkit-keyframes bgShow{
	0%{
		opacity:0;
	}
	100%{
		opacity:1;
	}
}
.fallDown{-webkit-transform:translate(0,-54px);-webkit-animation:bgJumpDown .5s ease-in forwards;}
@-webkit-keyframes bgJumpDown{
	0%{
		-webkit-transform:translate(0,-54px);
	}
	100%{
		-webkit-transform:translate(0,0);
	}
}
/* 01 */
.triangle{opacity:0;-webkit-animation:triangle .9s ease-out forwards}
@-webkit-keyframes triangle{
	0%{
		opacity:0;
		-webkit-transform:translate(-20px,-20px);
	}
	100%{
		opacity:1;
		-webkit-transform:translate(0,0);
	}
}
.tips-up{opacity:.3;bottom:12px;left:50%;margin-left:-11.5px;width:23px;webkit-transform:translate(0,4px);-webkit-animation:tipsUp 1.2s ease-in-out infinite }
@-webkit-keyframes tipsUp{
	0%{
		opacity:0;
		-webkit-transform:translate(0,5px);
	}
	50%{
		opacity:1;
		-webkit-transform:translate(0,0);
	}
	100%{
		opacity:.3;
		-webkit-transform:translate(0,-5px);
	}
}
/* 02 */
.icon-02{display:block;position:absolute;left:50%;width:16px;height:21px;background-image:url(../img/02-icon.png);background-size:80px auto}
.icon-02-1{background-position:0 0;top:277px;margin-left:-78px}
.icon-02-2{background-position:-16px 0;top:197px;margin-left:-53px}
.icon-02-3{background-position:-32px 0;top:267px;margin-left:-49px}
.icon-02-4{background-position:-48px 0;top:249px;margin-left:-22px}
.icon-02-5{background-position:-64px 0;top:248px;margin-left:56px}
/* 预约看房 */
.order{display:none;position:absolute;top:42px;width:100%;font-size:18px;color:#e64a4b;line-height:20px;text-align:center}
form{display:none;position:absolute;top:74px;left:50%;margin-left:-145px;width:290px;background:#fff;border-radius:2px;box-shadow:0 0 8px rgba(0,0,0,.08)}
form fieldset{position:relative;border-bottom:1px solid #e7e7e7;height:36px}
form fieldset:last-child{border-bottom:0}
form fieldset label{position:absolute;top:0;left:0;width:79px;border-right:1px solid #f2edec;font-size:14px;color:#3b434b;line-height:36px;text-align:center}
form fieldset input{float:right;background:none;padding:8px 10px;width:190px!important;height:20px;border:0;line-height:20px;font-size:14px;color:#8f9eb0}
form fieldset select{float:right;padding:0 10px;width:210px;height:36px;background:url(../img/14-arrow.png) no-repeat 188px 14px;background-size:auto 8px;border:0;font-size:14px;color:#8f9eb0}
.input-button{display:none;position:absolute;left:50%;margin-left:-145px;width:290px;border-radius:2px;font-size:15px;color:#fff;line-height:42px;text-align:center;text-shadow:0 2px 1px rgba(0,0,0,.2)}
.input-button:active{color:#fff}

.player-button{display:none;opacity:.8;position:fixed;z-index:10000;display:block;top:2px;right:2px;width:30px;height:30px;background:url(../../images/dynamicWeb/player-button.png) -30px 0;background-size:60px 30px;cursor:pointer;/*background-position: center;*/background-repeat: no-repeat;}
.player-button-stop{background-position:0 0}
.player-tip{position:absolute;top:5px;left:-140px;width:120px;background:rgba(59,89,114,.6);border-radius:4px 0 0 4px;font-size:10px;color:#ccc;line-height:20px;text-align:center}
.player-tip:after{content:"";position:absolute;right:-32px;width:0;height:0;border-left:16px solid rgba(59,89,114,.6);border-top:10px solid transparent;border-right:16px solid transparent;border-bottom:10px solid transparent;}

.wit{position: absolute;
left: 0;
bottom: 12px;
text-align: center;
width: 100%;color:#666;}
.wit a{color:#666;}
.tel-link{position: absolute;left:46%;bottom:18px;width:88px;height:20px;}

.PANO_spinner {
	position:absolute;
	left:50%;
	top:50%;
	width: 36px;
	height:36px;
	margin:-18px 0 0 -18px;
	-webkit-animation: spin 1s linear 0s infinite;
	-moz-animation: spin 1s linear 0s infinite;
	-ms-animation: spin 1s linear 0s infinite;
	-o-animation: spin 1s linear 0s infinite;
	animation: spin 1s linear 0s infinite
}
@-webkit-keyframes spin {
	from {
		-webkit-transform: rotate(0deg)
	}
	to {
		-webkit-transform: rotate(360deg)
	}
}
@-moz-keyframes spin {
	from {
		-moz-transform: rotate(0deg)
	}
	to {
		-moz-transform: rotate(360deg)
	}
}
@-o-keyframes spin {
	from {
		-o-transform: rotate(0deg)
	}
	to {
		-o-transform: rotate(360deg)
	}
}
@keyframes spin {
	from {
		transform: rotate(0deg)
	}
	to {
		transform: rotate(360deg)
	}
}